/*
  学习目标：props的基本使用
  作用: 传递数据
  props:  组件标签身上所有的属性, 组成的一个对象
*/

import React, { Component } from 'react';

export default class App extends Component {
  render() {
    return (
      <div>
        <Hello name="zs" des="狂徒"></Hello>
        <Child name="ls" des="好市民"></Child>
      </div>
    );
  }
}

// 1. 函数式组件
// 通过形参接收props
function Hello(props) {
  console.log('xxx  ----->  ', props);
  return <h1>Hello</h1>;
}
// 2. 类组件
class Child extends React.Component {
  // 通过this.props接收props对象
  render() {
    console.log('this  ----->  ', this);
    return <div>Child - {this.props.name}</div>;
  }
}
